<template>
	
	<view class="good_detail" >
		
		<!-- #ifdef APP-PLUS -->
		<uni-nav-bar :statusBar="true" :border="false"></uni-nav-bar>
		<!-- #endif -->
		<!-- 轮播图 -->
		 <scroll-view  scroll-y="true" class="scroll-Y"  >
		<view class="swipter">
			<u-swiper :list="banner" mode="number" height="300rpx" ></u-swiper>
		</view>
		
		<!-- 商品详情 -->
		<u-tag text="商品详情" type="primary" />
		<view v-for="(item,index) in detail" :key="index">
			<view class="content"  >
				<view class="title">
					{{item.title}}
				</view>
				<view class="total">
					￥{{item.total}}
				</view>
			</view>
			<view class="content">
				{{item.content}}
			</view>
			<view class="adress">
			<u-tag text="商品位置" type="primary" />
				<view class="adressname">
				{{item.adress}}
				</view>
			</view>
			<!-- 交易方式 -->
			<view class="way">
				<u-tag text="交易方式" type="primary" />
				<view class="waytext">
					<text>自行协商||自提||送货上门||约定交易地点||当面交易</text>
				</view>
			</view>
			<!-- 发布时间 -->
			<view class="time">
				<u-tag text="发布时间" type="primary" />
				<view class="timetext">
				<uni-dateformat  :date="item.last_modify_date" format="yyyy-MM-dd"
					:threshold="[60000, 2592000000]" />
				</view>
			</view>
			<view class="warning">
				<u-tag text="特别提醒" type="primary" />
				<view class="warning-text">
					<text>1.请坚决不要提前私下微信，支付宝等转账付款,付定金，会被拉黑财物两空.</text>
					<text>2.建议当面交易，一手交钱一手交货，更加安全.</text>
				</view>
			</view>
			<u-modal v-model="show" :content="'微信为：'+item.weixin" title="微信" mask-close-able=true >
				<template v-slot:confirm-button >
					<u-button type="success" size="mini"  @click="fuzhi(item.weixin)">复制</u-button>
				</template>
			</u-modal>
		</view>
		<view class="page_hd" >
			<u-grid :col="4" >
					<u-grid-item v-for="(item,index) in list" :key="index" @click="click(index)">
						<u-icon :name="item.iconPath" :size="46"></u-icon>
						<view class="grid-text">{{item.text}}</view>
					</u-grid-item>
				</u-grid>
		</view>
		</scroll-view>
		
		<u-gap height="30" bg-color="#bbb"></u-gap>
		<u-modal v-model="show1" :content="content1" show-cancel-button="true" @confirm="confirm"></u-modal>
		
	</view>
	
</template>

<script>
	import uniShare from '@/uni_modules/uni-share/js_sdk/uni-share.js';

	
	import {
		mapGetters
	} from 'vuex';
	export default {
		data() {
			return {
				form:{
					user_id:'',
					mysc:'',
					title:'',
					total:'',
					content:'',
					url:'',
					icon:''
				},
				icon:'',
				show1:false,
				show:false,
				content2:"",
				content1:'确定要取消收藏吗',
				titel:'收藏成功',
				
				// 当前显示 _id
				_id: "",
				title: 'title',
				detail:[],
				banner:[],
				// 数据表名
				// 查询字段，多个字段用 , 分割
				list: [
									{
										iconPath: "star",
										selectedIconPath: "star-fill",
										text: '收藏',
										customIcon: false,
									},
									{
										iconPath: "info-circle",
										selectedIconPath: "info-circle-fill",
										text: '举报',
										midButton: true,
										customIcon: false,
									},
									
									{
										iconPath: "man-add",
										selectedIconPath: "man-add-fill",
										text: '加微信',
										isDot: false,
										customIcon: false,
									},
									{
										iconPath: "chat",
										selectedIconPath: "chat-fill",
										text: '先聊一聊',
										isDot: false,
										customIcon: false,
									},
								],
								current:-1
			}
		},
		onLoad(event){
			this._id=event.id
			this.getgood()
			this.sctext()
		},
		onShareAppMessage(res) {
		    if (res.from === 'button') {// 来自页面内分享按钮
		      console.log(res.target)
		    }
		    return {
		      title: '宝贝商品',
		      path: '/pages/test/test?id=123'
		    }
		  },
		onNavigationBarButtonTap(event) {
				if (event.type == 'share') {
					this.shareClick();
				}
			},
			
			methods: {
				fuzhi(e){
					uni.setClipboardData({
					    data: e,
					    success: function () {
					        console.log('success');
					    }
					});
				},
				sctext(){
					
						const db = uniCloud.database() //代码块为cdb
						// 使用uni-clientDB
						db.collection('opendb-mall-goods')
						  .where({
						   user_id:this.$store.state.user.info._id,
						   mysc:this._id
						  }).get()
						  .then((res)=>{
						   this.list[0].iconPath=res.result.data[0].icon
					
						  }).catch((err)=>{
						    console.log(err.code); // 打印错误码
						        console.log(err.message); // 打印错误内容
						  }) 
					
				},
				confirm(){
					this.list[0].iconPath='star'
				},
				click(index){
					if(index==0){
						if(this.list[0].iconPath=='star'){
							this.list[0].iconPath='star-fill'
							
							this.form.user_id=this.$store.state.user.info._id
							this.form.mysc=this._id
							this.form.title=this.detail[0].title
							this.form.total=this.detail[0].total
							this.form.content=this.detail[0].content
							this.form.url=this.detail[0].url
							this.form.icon='star-fill'
							const db = uniCloud.database();
							 db.collection('opendb-mall-goods').add(this.form).then(res=>{
							 	uni.showToast({
							 		title:"收藏成功"
							 	})
							  })
							
						}
						else if(this.list[0].iconPath=='star-fill'){
							this.show1=true
							  const db = uniCloud.database();
							  db.collection("opendb-mall-goods").where({
								  mysc:this._id
							  }).remove();
							
						}
					}
					
					else if(index==2){
						this.show=true
					}
					
					else if(index==3){
						
						uni.navigateTo({
														 
							url:'/pages/chat/chat'
						})
					}
					
					
				},
				
				change(index){
					console.log(index)
					// index=this.current
					// if(this.current==0){
					// 	console.log('0')
					// }
					// if(this.current==1){
					// 	console.log('1')
					// }
					// if(this.current==2){
					// 	console.log('2')
					// }
					// if(this.current==3){
					// 	console.log('3')
					// }
					// console.log(index)
				},
				
				setReadNewsLog(){
					let item = {
						"article_id":this.id,
						"last_time":Date.now()
					},
					readNewsLog = uni.getStorageSync('readNewsLog')||[],
					index = -1;
					readNewsLog.forEach(({article_id},i)=>{
						if(article_id == item.article_id){
							index = i
						}
					})
					if(index === -1){
						readNewsLog.push(item)
					}else{
						readNewsLog.splice(index,1,item)
					}
					uni.setStorageSync('readNewsLog',readNewsLog)
					console.log(readNewsLog);
				},
				getgood(){
					const db=uniCloud.database()
					db.collection('opendb-news-articles').where({
						_id:this._id
					}).get().then((res)=>{
						this.detail=res.result.data
						this.detail.forEach((item,index)=>{
						this.banner.push(item.url)
						
			             })
					})	
				},
				
		}
		
	};
		
</script>

<style scoped>
	.swipter{
		padding: 40rpx;
	}
	image{
		width:80%;
		height:150px;
		display:block;
		margin:auto;
	}
	.content{
		display: flex;
		justify-content: space-between;
	}
	.title{
		font-size: 20px;
		margin: 5px 10px;
	}
	.total{
		font-size:20px;
		margin:5px 20px;
		color:#B50E03
	}
	.content{
		margin: 5px 10px;
	}
	.adress{
		margin:20px 0px;
	}
	.adressname{
		margin:5px 10px;
		font-size:20px;
	}
	.way{
		margin:20px 0px;
	}
	.waytext{
		margin:5px 10px;
		font-size:14px;
	}
	.timetext{
		margin:5px 10px;
		font-size:14px;
	}
	.warning{
		margin:20px 0px;
	}
	.warning-text{
		display: flex;  
        flex-direction:column; //灵活的项目将垂直显示，正如一个列一样。
		margin:5px 10px;
		font-size:14px;
		color:red;
	}
	.shoucang{
		justify-content: center;
		color:red
	}
	.scroll-Y{
		height: calc( 100vh - 55px);
	}
	.page_hd{
		
		bottom: var(--window-bottom,0);
		position:fixed; 
		width:750rpx;
	}
	
</style>
